@charset "UTF-8";
@import 'config';



.box{
  width: 100%;
  background: url("../img/register_1.png")no-repeat;
  @include bgs(748,1292);
  @include pt(23);
  @include pb(73);
  .nav{
    img{
      @include w(24);
      @include h(42);
      @include ml(50);
      @include mr(260);
    }
    h2{
      display: inline-block;
      @include w(76);
      margin: 0 auto;
      color: #ffffff;
      @include fs(36);
    }
  }
  .title{
    text-align: center;
    @include mt(102);
    @include mb(20);
    img{
      @include w(174);
      @include h(174);
      @include mb(34);
    }
  }
  .register{
    text-align: center;
    ul{
      li{
        margin: 0 auto;
        position: relative;
        img{
          @include w(40);
          @include h(40);
          @include mr(12);
          position: relative;
          @include t(12)
        }
        input{
          border: none;
          background: none;
          @include pl(36);
          @include w(330);
          color: #ffffff;
          outline: none;
          @include border-butt(1,solid,#ffffff);
          &::-webkit-input-placeholder{
            color: #ffffff;
          }
        }
        span {
          position: absolute;
          @include t(53);
          @include l(255);
          @include fs(16);
          color: yellow;
        }
      }
      li:nth-child(2){
        @include mt(28);
        @include mb(28);
      }
      li:last-child{
        input{
          @include w(192);
          @include mr(20);
        }
        div{
          display: inline-block;
          img{
            @include w(98);
            @include h(48);
          }
        }
        span {
          @include t(60);
        }
      }
    }
    .check{
      position: relative;
      @include mr(30);
      @include mt(6);
      a:nth-child(1){
        display: inline-block;
        @include fs(20);
        color: #ffffff;
        position: relative;
        @include l(170);
      }
      a:nth-child(2){
        display: block;
        color: #000000;
        @include w(414);
        @include bdr(10);
        position: relative;
        @include l(14);
        margin: 0 auto;
        @include fs(28);
        @include mt(18);
        @include mb(10);
        @include lh(60);
        background: #ffffff;
      }
      a:nth-child(3){
        display: block;
        color: #000000;
        @include w(200);
        @include bdr(10);
        position: relative;
        @include l(14);
        margin: 0 auto;
        @include fs(28);
        @include mt(30);
        @include mb(10);
        @include lh(60);
        background: #ffffff;

      }
    }
  }
  .login-way{
    @include mt(220);
    h2{
      color: #ff5b3d;
      @include fs(24);
      @include w(448);
      @include pb(16);
      margin: 0 auto;
      text-align: center;
      @include border-butt(1,solid,#3d3d3d);
    }
    div{
      text-align: center;
      a{
        display: inline-block;
        @include mt(42);
        @include ml(27);
        @include mr(27);
        img{
          @include w(80);
          @include h(80);
        }
      }
    }
  }
}